<!--
 * @Description: 会员基础设置
 * @Author: DXV-RGWU-TUFH-RFCY-IEGMYY
 * @Date: 2023-08-08 16:06:24
 * @LastEditTime: 2023-08-08 17:27:04
 * @LastEditors: DXV-RGWU-TUFH-RFCY-IEGMYY
-->

<template>
  <div class="lb-custom-member-set">
    <top-nav></top-nav>
    <div class="page-main">
      <el-form
        @submit.native.prevent
        :model="subForm"
        :rules="subFormRules"
        ref="subForm"
        label-width="140px"
      >
        <el-form-item label="是否启用会员体系" prop="status">
          <el-radio-group v-model="subForm.status">
            <el-radio :label="1">{{ $t('action.ON') }}</el-radio>
            <el-radio :label="0">{{ $t('action.OFF') }}</el-radio>
          </el-radio-group>
        </el-form-item>
        <block v-if="subForm.status === 1">
          <el-form-item label="成长值展示名称" prop="growth_name">
            <el-input
              v-model="subForm.growth_name"
              type="text"
              maxlength="10"
              show-word-limit
              placeholder="请输入自定义名称，不输入则默认【成长值】"
            ></el-input>
            <lb-tool-tips>例如淘宝【淘气值】，京东【京享值】</lb-tool-tips>
          </el-form-item>
          <el-form-item label="成长值设置" prop="growth_value">
            <el-input placeholder v-model="subForm.growth_value">
              <template slot="prepend">每消费1元增加</template>
              <template slot="append">成长值</template>
            </el-input>
          </el-form-item>
          <el-form-item label="成长值获取限制" prop="growth_limit">
            <el-radio-group v-model="subForm.growth_limit">
              <el-radio :label="1">限制</el-radio>
              <el-radio :label="0">不限制</el-radio>
            </el-radio-group>
            <lb-tool-tips
              >包含充值和微信、支付宝下单累计的金额，例如用户充值储值套餐可累积成长值，直接下单消费也能累积成长值
              <div class="mt-sm c-warning">
                成长值设置修改即时生效，对以往数据不产生影响
              </div>
            </lb-tool-tips>
          </el-form-item>
          <el-form-item
            label
            prop="max_growth_day"
            v-if="subForm.growth_limit === 1"
          >
            <el-input
              placeholder="0 至 9999999"
              v-model="subForm.max_growth_day"
            >
              <template slot="prepend">每日最多获得</template>
              <template slot="append">成长值</template>
            </el-input>
          </el-form-item>
          <el-form-item label="会员规则" prop="member_text">
            <lb-ueditor
              v-model="subForm.member_text"
              :destroy="true"
              :ueditorType="3"
            ></lb-ueditor>
          </el-form-item>
        </block>
        <el-form-item>
          <lb-button type="primary" @click="submitFormInfo" v-preventReClick>{{
            $t('action.submit')
          }}</lb-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
export default {
  data () {
    let validateIntMax = (rule, value, callback) => {
      if (!/^\+?[0-9]*$/.test(value)) {
        callback(new Error('请输入非负整数'))
      } else if (value * 1 < 1 || value * 1 > 9999998) {
        callback(new Error('请输入大于0且小于9999999的整数'))
      } else {
        callback()
      }
    }

    return {
      navTitle: '',
      subForm: { status: 0, growth_name: '', growth_value: '', growth_limit: 0, max_growth_day: '', member_text: '' },
      subFormRules: {
        status: { required: true, type: 'number', message: '请选择', trigger: 'blur' },
        growth_name: { required: true, validator: this.$reg.isNotNull, text: '成长值展示名称', reg_type: 2, trigger: 'blur' },
        growth_value: { required: true, validator: this.$reg.isFloatNum, text: '成长值', reg_type: 2, trigger: 'blur' },
        growth_limit: { required: true, type: 'number', message: '请选择', trigger: 'blur' },
        max_growth_day: { required: true, validator: this.$reg.isFloatNum, text: '成长值', reg_type: 2, trigger: 'blur' },
        member_text: { required: true, validator: this.$reg.isNotNull, text: '会员规则', reg_type: 2, trigger: 'blur' },
      }
    }
  },
  async created () {
    this.getDetail()
  },
  methods: {
    async getDetail () {
      let { data } = await this.$api.member.configInfo()
      data.member_text = data.member_text === null ? '' : data.member_text
      for (let key in this.subForm) {
        this.subForm[key] = data[key]
      }
    },
    async submitFormInfo () {
      let { status } = this.subForm
      let flag = status === 0
      if (status === 1) {
        this.$refs['subForm'].validate(valid => {
          if (valid) {
            flag = true
          }
        })
      }
      let subForm = JSON.parse(JSON.stringify(this.subForm))
      if (flag) {
        await this.$api.member.configUpdate(subForm)
        this.$message.success(this.$t('tips.successSub'))
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.lb-custom-member-set {
  width: 100%;
  .el-input,
  .el-select,
  .lb-input-number,
  .el-cascader,
  .el-textarea {
    width: 400px;
  }
}
</style>
